var introduceBox = document.getElementsByClassName('introduce_box');
var introduceBoxLen = introduceBox.length;
var card = [];
var cardLen = [] ;
var index;
var parentIndex ;

for(var i = 0; i<introduceBoxLen; i++)
{
  //然后出去当前父亲内的其它的元素的样式
  card[i] = introduceBox[i].children;//它是一个二维数组
  cardLen[i] = card[i].length;
  for(var j = 0; j< cardLen[i]; j++)
  {
    card[i][j].parentElement.parentIndex= i;
    card[i][j].index = j;
    card[i][j].onmouseenter = function()
    {
      parentIndex= this.parentElement.parentIndex;
      index = this.index;//以获取到当前元素下标
      card[parentIndex][index].style.transform = 'none';
      changeDisplay('none');
      card[parentIndex][index].style.display = 'flex';
    } 
    card[i][j].onmouseleave = function()
    {
      parentIndex= this.parentElement.parentIndex;
      index = this.index;//以获取到当前元素下标
      card[parentIndex][index].style.transform = 'rotateX(45deg) scale(0.9,0.9)';
      changeDisplay('flex');
    } 
  }
}
function changeDisplay(kind)
{
  for(var k = 0; k<cardLen[parentIndex]; k++)
  {
    card[parentIndex][k].style.display = kind;
  }
}